<template>
  <uni-nav-bar :title="title" left-icon="left" color="#333" @clickLeft="redirectTo('index/mine')" statusBar></uni-nav-bar>
  <!-- 头部 -->
  <CustomersTop :customersAll="customersAll"></CustomersTop>
  <!-- 菜单 -->
  <MenuBar :list="list"></MenuBar>
</template>

<script setup lang="ts">
import { customers } from '@/gql/customer';
import { getDriverID } from '@/stores/driverID';
import { useUserStore } from '@/stores/user';
import { redirectTo } from '@/utils/navigator';
import CustomersTop from '@c/customers/customersTop.vue';
import MenuBar from '@c/customers/menuBar.vue';
import { toPublish } from '@mqtt';
import { computed, Ref, ref } from 'vue';

// static
const userInfo = useUserStore();
const driver_id = getDriverID();
const customers_id = computed(() => userInfo.customers_id);
const title = ref('');
const customersAll: Ref<any> = ref({});
const list = ref([
  { text: '加注机', path: 'customers/fillingList' },
  { text: '车辆', path: 'customers/carList' },
  { text: '订单', path: 'customers/orderList' },
]);

driverCar();

/**
 * 获取大客户授权信息
 */
function driverCar() {
  const payload = {
    query: customers,
    variables: { customers_id, driver_id },
  };
  toPublish('customers/customersDriver', payload, (obj: any) => {
    const { customers_by_driver } = obj.data;
    customersAll.value = customers_by_driver;
    const { customers_name, fill_count, cart_count, order_count } = customers_by_driver;
    title.value = customers_name;
    uni.setStorageSync('customersName', customers_name);
    list.value = [
      { text: `加注机(${fill_count})`, path: '/pages/customers/fillingList' },
      { text: `车辆(${cart_count})`, path: '/pages/customers/carList' },
      { text: `订单(${order_count})`, path: '/pages/customers/orderList' },
    ];
  });
}
</script>

<style scoped lang="less"></style>
